<template>
  <div class="search">
    <f-form ref="form" :action="api.shop" :form-key="this.formItem.shopId">
      <f-form-item label="店铺Logo" type="upload" name="shopLogo" :value="formItem.shopLogo" :file-max="1"/>
      <f-form-item label="所属分类" name="typeId" :required="true" type="select" :data="api.type.list" :value="formItem.typeId" label-key="typeName" value-key="typeId" :disabled="true"/>
      <f-form-item label="店铺名称" name="shopName" :required="true" :value="formItem.shopName" :disabled="true"/>
      <f-form-item label="联系人" name="linkMan" :required="true" :value="formItem.linkMan"/>
      <f-form-item label="联系电话" name="linkTel" :required="true" :value="formItem.linkTel"/>

      <f-form-item label="所属区域" type="areaSelect" name="areaIds" :required="true" :value="areaIds" v-if="loaded"></f-form-item>
      <f-form-item label="店铺地址" name="shopAddress" :required="true" :value="formItem.shopAddress"/>
      <f-form-item label="营业时间" type="other">
        <a-time-picker :defaultValue="moment(formItem.businessHoursBegin, 'HH:mm')" format="HH:mm" @change="beginChange"/>
        <a-time-picker :defaultValue="moment(formItem.businessHoursEnd, 'HH:mm')" format="HH:mm" style="padding-left: 5px" @change="endChange"/>
      </f-form-item>

    </f-form>
    <div style="padding-left: 100px">
      <a-button type="primary" @click="handleSubmit" :loading="saving">保存</a-button>
    </div>
  </div>
</template>

<script>
  import moment from 'moment'

  export default {
    name: 'ShopInfo',
    props: {},
    data() {
      return {
        isAdd: true,
        loaded: false,
        areaIds: [],
        formItem: this.getFormItem()
      }
    },
    methods: {
      moment,
      getFormItem() {
        return {
          shopName: '',
          businessHoursBegin: '8:00',
          businessHoursEnd: '18:00'
        }
      },
      setData(userInfo) {
        this.$refs.form.resetFields()
        this.$refs.form.getDetails({ shopId: userInfo.companyId }, (data) => {
          this.formItem = data
          this.areaIds = [this.formItem.proId, this.formItem.cityId, this.formItem.areaId]
          let businessHours = data.businessHours
          if (businessHours) {
            let hours = businessHours.split('-')
            this.formItem.businessHoursBegin = hours[0]
            this.formItem.businessHoursEnd = hours[1]
          }
          this.loaded = true
        })
      },
      beginChange(data1, data2) {
        this.formItem.businessHoursBegin = data2
      },
      endChange(data1, data2) {
        this.formItem.businessHoursEnd = data2
      },
      handleSubmit() {
        let businessHours = this.formItem.businessHoursBegin + '-' + this.formItem.businessHoursEnd
        this.$refs.form.handlerSubmit({ businessHours: businessHours })
      }
    },
    created() {

    },
    components: {}
  }
</script>

<style scoped lang="less" rel="stylesheet/less">

</style>
